<!--
 * @Author: your name
 * @Date: 2020-12-19 08:51:59
 * @LastEditTime: 2020-12-21 16:54:54
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \wms2\src\views\outStorage\delivery\components\item.vue
-->
<template>
  <div style="margin-top:30px">
    <!-- <vxe-toolbar id="outboundId" :setting="{storage: true}" export :refresh="{query: getInventory}">
      <template v-slot:buttons>
        <el-button @click="getInventory">查询</el-button>
      </template>
    </vxe-toolbar> -->

    <vxe-table
      ref="xTable"
      border
      row-id="id"
      height="500"
      :loading="loading"
      :data="tableData"
      :edit-config="{trigger: 'click', mode: 'row', showStatus: true}"
    >
      <template v-slot:empty>
        <p> </p>
      </template>
      <vxe-table-column type="checkbox" width="60"></vxe-table-column>
      <vxe-table-column field="goodsName" title="商品名称" width="120"></vxe-table-column>
      <vxe-table-column field="goodCode" title="商品编码"  width="120"></vxe-table-column>
      <vxe-table-column field="goodsBarCode" title="商品条码" ></vxe-table-column>
      <vxe-table-column field="goodsUnitName" title="单位"></vxe-table-column>
      <vxe-table-column field="canReturnQuantity" title="可退数量"></vxe-table-column>
      <vxe-table-column field="refundQuantity" title="退货数量" ></vxe-table-column>
      <vxe-table-column field="remarks" title="备注" ></vxe-table-column>
    </vxe-table>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="funcSubmit">确 定</el-button>
    </div>
  </div>
</template>
<script>
import Vue from 'vue'
import 'xe-utils'
import VXETable from 'vxe-table'
import request from '@/utils/request'
import 'vxe-table/lib/index.css'
import { getRefundOutItems } from '@/api/outStorage'

Vue.use(VXETable)
export default {
  name: 'JobItemAdd',

  data() {
    return {
      optionType: '',
      loading: false,
      emptyForm: {},
      groupCode:'',
      shipmentCode:'',
      chargeAgreementCodeData: [], // 计算类型数组
      tableData: [],
      listQuery:{
        goodsName:''
      }
    }
  },
  created() {

  },
  methods: {
    getInfo(code){
      getRefundOutItems(code).then(response => {
        this.tableData = response.data
        this.tableData.forEach( i => {
          i.sourceItemCode = i.receiveItemCode
          i.basicQuantity = i.unitConvertQuantity
        })
      })
    },
    // 提交
    funcSubmit() {
      let selectRecords = this.$refs.xTable.getCheckboxRecords()
      if(this.$refs.xTable.getCheckboxRecords() == 0){
        this.$message.error('请选择退货商品')
      }else{
        this.$emit('fatherAddMethod', selectRecords)
      }

    },
  }
}
</script>
<style lang="scss" scoped>
  .dialog-footer {
    margin: 15px 0 15px 0;
    width: 175px;
    float: right;
  }
</style>
